import React, { FC, memo } from 'react'
import { IArtist } from 'apis/types/business'
import styles from './style.module.css'
interface IProps {
  artists: IArtist[]
}
const Artists: FC<IProps> = memo(({ artists = [] }) => {
  return (
    <div className={styles.root}>
      {artists.map((v, i) => {
        i !== artists.length - 1 ? (
          <div key={v.name}>
            <span className={styles.singer}>{v.name}</span>
            <span className={styles.slash}>/</span>
          </div>
        ) : (
          <span className={styles.singer} key={v.name}>
            {v.name}
          </span>
        )
      })}
    </div>
  )
})
export default Artists
